<template>
  <div class="hello">
    <h2>总投票数:{{$store.getters.sumcount}}</h2>
    <input type="button" value="为java投票" @click="addjavacount()">（{{$store.state.javacount}}）
    <input type="button" value="为python投票" @click="addpythoncount()">（{{$store.state.pythoncount}}）
    <input type="button" value="为php投票" @click="addphpcount()">（{{$store.state.phpcount}}）
  </div>
</template>

<script>
 import {mapMutations} from "vuex";
export default {
  name: 'HelloWorld',
  methods:{
    //第一种方式：this.$store.commit('xxx')
    addjavacount(){
      this.$store.commit('addjavacount')
    },
    addpythoncount(){
      this.$store.commit('addpythoncount')
    },
    addphpcount(){
      this.$store.commit('addphpcount')
    }
    //第二种方式：使用 mapMutations 辅助函数将组件中的 methods 映射为 store.commit 调用
    // ...mapMutations(["addjavacount","addpythoncount","addphpcount"]),
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>

</style>
